
import React, { Component } from 'react';
//引入form组件
import { Form, Input, Button, Checkbox,} from 'antd';//引入标签
import { layout, tailLayout } from '../const.js';
// import axios from 'axios';
import { adminlogin } from '../apis/admin.js';
export default class Login extends Component {
    state = {
        // button点击后弹框
        loading: false,
    }
    onFinish = async (values) => {
        try {
            console.log("页面输入的登陆信息",values);//页面输入的登陆信息
            this.setState({loading:true})
            const data = await adminlogin(values);
            this.setState({loading:false})
            console.log("请求回来的数据",data);
            //
            const {token, userInfo } = data;
            localStorage.setItem('token', token);
            localStorage.setItem('userInfo', JSON.stringify(userInfo));
            this.props.history.push('/home') ;

        } catch (error) {
            console.log("输入错误", error);
            this.setState({ loading: false })
        }
    };

    onFinishFailed = (errorInfo) => {
        console.log('Failed:', errorInfo);
    };
    render() {
        const {loading } = this.state;
        return (
            <div className="login">
                <Form
                    className="loginform"
                    {...layout}
                    name="basic"
                    initialValues={{
                        remember: true,
                    }}
                    onFinish={this.onFinish}
                    onFinishFailed={this.onFinishFailed}
                >
                    <Form.Item
                        label={<div style={{ width: 100 }}>用户名</div>}
                        name="adminname"
                        rules={[
                            {
                                required: true,
                                message: 'Please input your username!',
                            },
                        ]}
                    >
                        <Input placeholder='请输入用户名' />
                    </Form.Item>

                    <Form.Item

                        label={<div style={{ width: 100 }}>密码</div>}
                        name="password"
                        rules={[
                            {
                                required: true,
                                message: 'Please input your password!',
                            },
                        ]}
                    >
                        <Input.Password autoComplete="newPassword" />
                    </Form.Item>

                    <Form.Item  {...tailLayout} name="remember" valuePropName="checked">
                        <Checkbox>Remember me</Checkbox>
                    </Form.Item>

                    <Form.Item {...tailLayout}>
                        <Button type="primary" htmlType="submit"  loading ={loading}>
                            登陆
                        </Button>
                    </Form.Item>
                </Form>

            </div>

        )
    }
}
